<ul class="layout">
	<li><input type="text" id="{$_rs.identifier}" name="{$_rs.identifier}" value="{$_rs.content}" /></li>
	<li class="{$_rs.identifier}-preview" style="line-height:38px;"></li>
</ul>

<script type="text/javascript">
$(document).ready(function(){
	var tag_data = [
		{loop from=$_iconlist key=$key value=$value id=$tmpid}
		{name:'{$value}',desc:'<i class="{$_rs.ext_prefix} {$_rs.ext_prefix}-{$value}"></i> {$_rs.ext_prefix}-{$value}'},
		{/loop}
	];
	$('#{$_rs.identifier}').selectPage({
		showField : 'desc',
		keyField : 'name',
		data : tag_data,
		multiple:false,
		pagination:false,
		selectToCloseList:true,
		autoSelectFirst:true,
		eSelect : function(data){
			if(data.name == ''){
				$('.{$_rs.identifier}-preview').html('');
			}else{
				$('.{$_rs.identifier}-preview').html('<i class="{$_rs.ext_prefix} {$_rs.ext_prefix}-'+data.name+'" style="font-size:16px;"></i>  {$_rs.ext_prefix}-'+data.name);
			}
		},
		eClear:function(datas){
			$('.{$_rs.identifier}-preview').html('');
		}
	});
});
</script>
